<template>
	<e-popup bgColor="transparent" :show="show" mode="center">
		<view class="advertising e-rela">
			<view @tap="handleJump">
				<load-image mode="aspectFill" :size="['588rpx', '708rpx']" radius="40rpx" :src="option.imgUrl"></load-image>
			</view>

			<image class="close-icon e-abso img-48" src="/static/layout/close.png" @tap="show = false"></image>
		</view>
	</e-popup>
</template>

<script lang="ts" setup>
import { ref } from 'vue';
import type { pageLink } from './type';
import { useLayoutCompoments } from './hooks';
import { useCurrentInstance } from '@/common/hooks';

const props = withDefaults(
	defineProps<{
		option: {
			openAd: boolean;
			imgUrl: string;
			link?: pageLink;
			showType: 1 | 2;
			count: number;
		};
	}>(),
	{
		option: () => ({
			openAd: false,
			imgUrl: '',
			showType: 1,
			count: 1
		})
	}
);
const ctx = useCurrentInstance();

const show = ref(true);

const { jumpLink } = useLayoutCompoments(ctx, props.option);

const handleJump = () => {
	show.value = false
	jumpLink(props.option.link)
}

</script>
<style></style>
<style lang="scss" scoped>
.advertising {
	width: 588rpx;
	height: 786rpx;
}

.close-icon {
	bottom: 0rpx;
	left: calc(50% - 24rpx);
}
</style>
